
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="cn.educate.service.SearchService" %>
<%@ page import="cn.educate.model.SearchResult" %>
<%
    String query = request.getParameter("search");
    List<SearchResult> results = new ArrayList<>();
    if (query != null && !query.isEmpty()) {
        SearchService searchService = new SearchService();
        results = searchService.search(query);
    }
%>
<html>
<head>
<%--    <title>搜索结果</title>--%>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/style.css">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
    <style>
        body {
            font-family: 'Roboto', sans-serif;
            margin: 0;
            padding: 0;
            color: #333;
            background-color: #f8f9fa;
        }
        .search-results {
            margin-top: 40px;
        }
        .search-results .result-item {
            padding: 10px;
            border-bottom: 1px solid #ddd;
        }
        .search-results .result-item h4 {
            margin-bottom: 10px;
            color: #333; /* 深色标题 */
        }
        .search-results .result-item p {
            margin-bottom: 10px;
            color: #666; /* 浅色描述 */
        }
        .search-results .result-item a {
            color: #007bff;
            text-decoration: none;
            transition: color 0.2s;
        }
        .search-results .result-item a:hover {
            text-decoration: underline;
            color: #0056b3; /* 深蓝色链接 */
        }
    </style>
</head>
<body>

    <div class="nav-container">
        <div class="nav-links">
            <a href="index.jsp" class="nav-link">首页</a>

            <a href="news.jsp" class="nav-link">新闻讯息</a>
            <a href="courses.jsp" class="nav-link">微课程</a>
            <a href="about.jsp" class="nav-link">关于我们</a>
            <a href="feedback.jsp" class="nav-link">用户反馈</a>
            <a href="innovate.jsp" class="nav-link">创新点</a>
            <a href="login.jsp" class="nav-link">登录</a>
            <a href="register.jsp" class="nav-link">注册</a>

        </div>
        <%-- 搜索框 --%>
        <div class="search-container">
            <form action="search.jsp" method="get">
                <input type="text" name="search" placeholder="<%= query == null || query.isEmpty() ? "请输入搜索关键词" : "" %>">
                <button type="submit">搜索</button>
            </form>
        </div>
        <%-- 搜索结果展示区 --%>
        <div class="container search-results">
            <% if (query != null && !query.isEmpty()) { %>
            <% if (results.isEmpty()) { %>
            <div class="result-item">
                <p>未找到与“<%= query %>”相关的结果。</p>
            </div>
            <% } else { %>
            <% for (SearchResult result : results) { %>
            <div class="result-item">
                <h4><a href="<%= result.getUrl() %>"><%= result.getTitle() %></a></h4>
                <p><%= result.getDescription() %></p>
            </div>
            <% } %>
            <% } %>
            <% } %>
        </div>
        <div class="nav-links">

        </div>
    </div>
    </div>
</body>

</body>
</html>
